import { useState, useEffect, useContext, useRef } from 'react'
import { Button, Descriptions, Divider, InputNumber, Radio, Space, Table } from 'antd';
import { CloseOutlined } from '@ant-design/icons';
import PanelRight from '../../../../../common/PanelRight';
import { resourcePath } from '../../../../../../utils/resource';
export default function RightPanel(props) {
   
    return props.visible ? <PanelRight>
        <div style={{
            width: 350,
            position: "absolute",
            right: 30,
            top: 30,
            bottom: 30,
            background: 'rgba(1,15,31,0.5)',
            // border: '1px solid rgba(9,107,225,0.8)',
            pointerEvents: 'auto',
            overflow: "auto",
            borderRadius: 8,
            zIndex: 2
        }} className="layout-v">
            <div style={{
                fontSize: 20,
                fontWeight: "bold",
                marginBottom: 12
            }} className='layout-h center'>
                <div className='fill w0'>
                    <div style={{
                        background: `url(${resourcePath.blockTitleBg})`,
                        height: 36,
                        backgroundSize: '100% 100%',
                        fontSize: 18,
                        lineHeight: '36px',
                        paddingLeft: 12,
                        fontWeight: "bold",
                        overflow: "hidden"
                    }}>
                        {'分析结果'}
                    </div>
                </div>
                <div>
                    <Button size="small" icon={<CloseOutlined />} style={{
                        // color: "#fff"
                    }} onClick={e => {
                        props.onClose?.()
                    }} />
                </div>
            </div>
            <div className='fill h0 layout-v '>
                {props.children}
            </div>
        </div>
    </PanelRight> : null;
}